.code-excerpt {
    :global(.line),
    :global(.code) {
        height: 16px;

        @media (min-width: 768px) {
            height: 18px;
        }

        vertical-align: middle;
        padding: 0;
    }

    :global(.line) {
        min-width: 1.5rem;
        text-align: right;
        user-select: none;
        cursor: pointer;

        &:hover {
            text-decoration: none;
        }

        &::before {
            /* draw line number with css so it cannot be copied to clipboard */
            content: attr(data-line);
            color: var(--cody-chat-code-text-muted);
        }
    }

    :global(.code) {
        white-space: pre;
        padding-left: 1rem;
    }

    &-error {
        width: 100%;
    }

    &-alert {
        margin-bottom: 0;
        color: #c92a2a;
    }

    :global(.hl-text) {
        color: #657b83;
    }
}
